$(function () {

    function getData() {
        $.get('/admin/data/info', function (res) {
            $('.totalCount em').html(res.totalArticle)
            $('.totalCount_day em').html(res.dayArticle)
            $('.commentCount em').html(res.totalComment)
            $('.commentCount_day em').html(res.dayComment)
        })
    }
    getData()

    $.get('/admin/data/article', function (res) {
        let date = []
        let count = []
        res.date.forEach(i => {
            date.push(i.date)
            count.push(i.count)
        })
        let box = document.querySelector('#day_article_show')
        const myChart = echarts.init(box)
        const option = {
            color: ['red'],
            title: {
                text: '渐变堆叠面积图'
            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'cross',
                    label: {
                        backgroundColor: '#6a7985'
                    }
                }
            },
            legend: {
                data: 'Line 1'
            },
            toolbox: {
                feature: {
                    saveAsImage: {}
                }
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            xAxis: [{
                type: 'category',
                boundaryGap: false,
                data: date
            }],
            yAxis: [{
                type: 'value'
            }],
            series: [{
                type: 'line',
                stack: '总数',
                smooth: true,
                lineStyle: {
                    width: 2
                },
                label: {
                    show: true
                },
                showSymbol: true,
                areaStyle: {
                    opacity: 0.8,
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                        offset: 0,
                        color: 'red'
                    }, {
                        offset: 1,
                        color: '#fff'
                    }])
                },
                emphasis: {
                    focus: 'series'
                },
                data: count
            }]
        }
        myChart.setOption(option)
    })
    $.get('/admin/data/category', function (res) {
        let date = []
        let box = document.querySelector('#pie_show')
        const myChart = echarts.init(box)
        let option;
        res.date.forEach(function (i) {
            console.log(i.name)
            date.push({ value: i.articles, name: i.name })
        })
        option = {
            tooltip: {
                trigger: 'item'
            },
            legend: {
                top: '5%',
                left: 'center'
            },
            series: [
                {
                    name: '访问来源',
                    type: 'pie',
                    radius: ['40%', '70%'],
                    avoidLabelOverlap: true,
                    label: {
                        show: false,
                        position: 'center'
                    },
                    emphasis: {
                        label: {
                            show: true,
                            fontSize: '40',
                            fontWeight: 'bold'
                        }
                    },
                    labelLine: {
                        show: false
                    },
                    data: date
                }
            ]
        }
        myChart.setOption(option)
    })
    $.get('/admin/data/visit', function (res) {
        console.log(res)
        let date = []
        let date_xAxis = []
        let series = []
        let date_series = []
        let key;
        for (key in res.data) {
            console.log(res.data[key], key)
            date.push(key)
            series.push(res.data[key])
        }
        for (index = date.length - 1; index >= 0; index--) {
            date_xAxis.push(date[index])

        }
        for (index = series.length - 1; index >= 0; index--) {
            date_series.push(series[index])

        }
        console.log(date_xAxis, date_series)
        const box = document.querySelector('#column_show')
        const myChart = echarts.init(box);
        const option = {
            xAxis: {
                type: 'category',
                data: date_xAxis
            },
            yAxis: {
                type: 'value'
            },
            series: [{
                data: date_series,
                type: 'bar'
            }]
        }
        myChart.setOption(option);
    })
})